<div class="navbar" id="navbar">
    <div class="navbar-inner">
        <a class="logo" href="${domain}"><span></span>创新研发中心</a>
        <ul class="navbar-list clearfix" id="navbarList">
            <li id="index"><a href="${domain}">首页</a></li>
            <li id="service">
                <a href="${domain}/service.html">创硏服务<span class="i-border-arrow"></span></a>
                <div class="navbar-menu">
                    <div class="navbar-menu-inner" id="menu">
                        <ul class="navbar-menu01">
                            <li class="current"><a href="javascript:;">产品 &gt;</a></li>
                            <!--<li><a href="javascript:;">技术 &gt;</a></li>-->
                        </ul>
                        <div class="navbar-menu02">
                            <ul style="display: block;">
                                <li class="current">
                                    <a href="javascript:;">文化领域 &gt;</a>
                                    <ul class="navbar-menu03">
                                        <li class="navbar-menu03-inner">
                                            <a href="http://www.51kupai.com/">
                                                <h2 class="ellipsis">库拍</h2>
                                                <p class="ellipsis">库拍是一个全球首创的分享式拍卖平台，分别从“主题”、“库拍”、“众筹”、“展览”四个维度给
                                                    用户带来不一样的艺术体验。</p>
                                            </a>
                                        </li>
                                        <li class="navbar-menu03-inner ellipsis">
                                            <a href="http://51shizhong.com/">
                                                <h2 class="ellipsis">时钟教室</h2>
                                                <p class="ellipsis">我们通过提供灵活的、开放的空间租赁服务，将线上与线下空间资源整合对接，优化空间设计，提供空间服务</p>
                                            </a>
                                        </li>
                                    </ul>
                                </li>
                                <li>
                                    <a href="javascript:;">房产领域 &gt;</a>

                                    <ul class="navbar-menu03">
                                        <li class="navbar-menu03-inner">
                                            <a href="https://fangjs.sina.com.cn/">
                                                <h2 class="ellipsis">房金所</h2>
                                                <p class="ellipsis">由新浪、易居中国、众安保险、新浪支付、银众在线强力联合背书，力邀优质房地产合作伙伴参与，顶级阵容联袂打造专业、安全、高效的房地产互联网金融P2P服务平台</p>
                                            </a>
                                        </li>
                                        <li class="navbar-menu03-inner ellipsis">
                                            <a href="http://www.fangyou.com">
                                                <h2 class="ellipsis">房友</h2>
                                                <p class="ellipsis">始终秉承对房地产中介服务行业的热情，通过对交易流程的不断创新，推动房地产中介行业变革，让行业回归服务本质。</p>
                                            </a>
                                        </li>
                                        <li class="navbar-menu03-inner ellipsis">
                                            <a href="http://www.51zb.cn/">
                                                <h2 class="ellipsis">首播</h2>
                                                <p class="ellipsis">首播APP独创行业PGC专业模式、UGC裂变模式、专题活动模式、地产网红模式四大直播模式，整合资源聚拢人气。PGC专业直播将倾力打造王牌直播栏目，内容涵盖售楼处专访、大佬揭秘等多项栏目，全方面专业解读项目情况。</p>
                                            </a>
                                        </li>
                                        <li class="navbar-menu03-inner ellipsis">
                                            <a href="http://www.ejucloud.com/">
                                                <h2 class="ellipsis">云眼</h2>
                                                <p class="ellipsis">“云眼”依托易居大数据，利用最前沿的分析技术，实现数据整合、客群分析、精准广告投放等功能，帮助开发商高效的制定营销策略</p>
                                            </a>
                                        </li>
                                    </ul>
                                </li>

                                <li>
                                    <a href="javascript:;">经济领域 &gt;</a>

                                    <ul class="navbar-menu03">
                                        <li class="navbar-menu03-inner">
                                            <a href="https://www.yjyyun.com/">
                                                <h2 class="ellipsis">壹加壹云</h2>
                                                <p class="ellipsis">易居创研旗下的一站式支付云服务平台，以“简单、专注、协作”为团队服务理念，通过聚合支付、电子钱包、电子卡券、会员系统、二级商户平台、供应链结算等多个云应用产品，结合商户业务实际使用场景不断整合优化行业支付解决方案，为合作伙伴提供专业的支付云服务。</p>
                                            </a>
                                        </li>
                                        <li class="navbar-menu03-inner ellipsis">
                                            <a href="http://www.jpinvestment.cn/">
                                                <h2 class="ellipsis">钜派在线</h2>
                                                <p class="ellipsis">由新浪、易居中国、众安保险、新浪支付、银众在线强力联合背书，力邀优质房地产合作伙伴参与，顶级阵容联袂打造专业、安全、高效的房地产互联网金融P2P服务平台。</p>
                                            </a>
                                        </li>
                                    </ul>
                                </li>

                                <li>
                                    <a href="javascript:;">生活领域 &gt;</a>

                                    <ul class="navbar-menu03">
                                        <li class="navbar-menu03-inner">
                                            <a href="">
                                                <h2 class="ellipsis">Clicker遛宠</h2>
                                                <p class="ellipsis">Clicker引进美国顶级飞盘狗驯犬大师，指导科学驯犬，只要有驯犬教程，到哪里都可以玩飞盘狗。我们提倡人宠健康生活，针对宠种定制个性化遛宠路程，所以你一定要记得添加你的宠物档案哦，健康生活从你开始，合理的遛宠让宠物生活更加美好！</p>
                                            </a>
                                        </li>
                                        <li class="navbar-menu03-inner ellipsis">
                                            <a href="">
                                                <h2 class="ellipsis">壹二</h2>
                                                <p class="ellipsis">壹二是一个全新的生活方式VR电商平台， 专注于探索城市中最独特鲜明的型店美铺，并用VR全景的形式带给用户最真实的沉浸式购物体验。 壹二关注每一个店铺场景的陈设，以此展现不同品牌的多样性和差异性。同时我们鼓励用户走向实体店，形成线上线下互补的体验流程。并且通过VR沉浸式的购物模式，提供新鲜的视觉体验和更符合日常经验的交互。</p>
                                            </a>
                                        </li>
                                    </ul>
                                </li>

                                <li>
                                    <a href="javascript:;">工作领域 &gt;</a>

                                    <ul class="navbar-menu03">
                                        <li class="navbar-menu03-inner">
                                            <a href="http://www.17youyun.com/">
                                                <h2 class="ellipsis">游云通讯</h2>
                                                <p class="ellipsis">游云通讯将专业通讯能力打包成API接口和SDK，让App、Web、企业系统轻松接入拥有IM（单聊/群聊/实时聊天室）、消息推送、网络语音通话/会议等多种专业通讯能力，让开发者享受一站式、自助式、合作式的通讯云技术支持。</p>
                                            </a>
                                        </li>
                                        <li class="navbar-menu03-inner ellipsis">
                                            <a href="">
                                                <h2 class="ellipsis">易家人</h2>
                                                <p class="ellipsis">”易家人”是创新研发中心专为易居集团打造的沟通和协同的多终端平台，随时随地的连接员工、信息化系统和应用，实现业务及管理互联网化，全方位提升集团内部沟通和协同效率</p>
                                            </a>
                                        </li>
                                    </ul>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </li>
            <li id="joinus" class="navbar-join">
                <a href="${domain}/showus.html">招募精英<span class="i-border-arrow"></span></a>
                <div class="navbar-menu">
                    <div class="navbar-menu-inner">
                        <ul class="navbar-menu01">
                            <li id="joinus-1"><a href="${domain}/showus.html">员工风采</a></li>
                            <li id="joinus-2"><a href="${domain}/joinus.html">招聘职位</a></li>
                        </ul>
                    </div>
                </div>
            </li>
            <li id="event"><a href="${domain}/event.html">创硏动态</a></li>
            <li id="aboutus"><a href="${domain}/aboutus.html">关于我们<span class="i-border-arrow"></span></a></li>
        </ul>
    </div>
</div>
<script type="text/javascript">
    window.addEventListener('load', function(){
        var oNavbar = document.querySelector("#navbar");
        var aNavList = oNavbar.querySelectorAll(".navbar-list > li");
        var aNavMenu = oNavbar.querySelectorAll(".navbar-menu");
        var oMenu01 = document.querySelector(".navbar-menu01");
        var aMenu01Li = document.querySelectorAll(".navbar-menu01 > li");
        var aMenu02Ul = document.querySelectorAll(".navbar-menu02 > ul");
        var aMenu02Li = document.querySelectorAll(".navbar-menu02 > ul > li");
        var aMenu03Ul = document.querySelectorAll(".navbar-menu03");


        function current(e, aMenu, ele){
            //current状态
            for(var i = 0; i < aMenu.length; i++){
                aMenu[i].index = i;
                aMenu[i].className = "";
            }
            e.currentTarget.className = "current";

            //判断显示左边第二栏
            if(ele){
                for(var n = 0; n < ele.length; n++) ele[n].style.display = "none";

                if(ele[e.currentTarget.index]){
                    ele[e.currentTarget.index].style.display = "block";
                }
            }
        };

        //点击左一显示左二
        for(var i = 0; i < aMenu01Li.length; i++){
            aMenu01Li[i].addEventListener("click", function(e){
                current(e,aMenu01Li, aMenu02Ul);
            }, false);
        }

        for(var i = 0; i < aMenu02Li.length; i++){
            aMenu02Li[i].addEventListener("click", function(e){
                current(e, e.currentTarget.parentNode.querySelectorAll("li"));
            }, false);

        }
    })
</script>